<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      const list = [
        { id: '1001', manager: '管理员', name: '行政部', pid: '' },
        { id: '1002', manager: '管理员', name: '财务部', pid: '' },
        { id: '1003', manager: '管理员', name: '人事部', pid: '' },
        { id: '1004', manager: '巴斯慧', name: '上海事业部', pid: '1001' },
        { id: '1005', manager: '孙财', name: '财务核算部', pid: '1002' },
        { id: '1006', manager: '张飞', name: '税务管理部', pid: '1002' }
      ]
      // const map = {}
      // list.forEach(item=>{
      //   item.children = []
      //   map[item.id] = item
      // })
      // console.log(list);
      // console.log(map);
      // // 遍历数据,生成最终的树形结构
      // const treeList = []
      // list.forEach(item=>{
      //     // 找关系,找出父级的对象,如果找到父级对象,将item添加到父级对象children中
      //     // 判断是否是子级数据对象
      //   if(item.pid){
      //     // 子级数据对象
      //     const parent = map[item.pid]
      //     parent.children.push(item)
      //   }else{
      //     // 一级数据对象
      //     treeList.push(item)
      //   }
      // })
      // console.log(treeList);

      // 封装函数

      function tranListTotreeList(list) {
        const map = {}
        list.forEach((item) => {
          item.children = []
          map[item.id] = item
        })
        console.log(list, 'list')
        console.log(map)
        // 遍历数据,生成最终的树形结构
        const treeList = []
        list.forEach((item) => {
          // 找关系,找出父级的对象,如果找到父级对象,将item添加到父级对象children中
          // 判断是否是子级数据对象
          if (item.pid) {
            // 子级数据对象
            const parent = map[item.pid]
            console.log('parenr', parent)
            parent.children.push(item)
          } else {
            // 一级数据对象
            treeList.push(item)
          }
        })
        return treeList
      }
      console.log(tranListTotreeList(list))
    </script>
  </body>
</html>
